<template>
	<view>

		<view class="main-img">
			<image :src="info.image" mode=""></image>
		</view>


		<!-- 详情区域 -->

		<view class="box">
			<view class="boxer">
				<view class="title">{{ info.title }}</view>
				<view class="title2"><text class="dian"></text>活动时间：{{ doreset(info.begintime) }}</view>
				<view class="title2"><text class="dian"></text>截止报名：{{ doreset(info.endtime) }}</view>
				<view class="title2"><text class="dian"></text>活动地点：{{ info.remark }}</view>
				<view class="title2"><text class="dian"></text>联系电话：{{ info.phone }}</view>
				<view class="title2"><text class="dian"></text>报名人数：{{ info.man+info.woman }} （男{{ info.man }} 女{{ info.woman }})
				</view>
				<view class="title2"><text class="dian"></text>已报名人数：男{{ info.hasMan }} 女{{ info.hasWoman }} </view>
			</view>

			<rich-text :nodes="info.maincontent"></rich-text>

		</view>

		<view class="foot">
			<view class="left">活动费用<text class="rmb">¥</text><text class="price">{{ info.cost }}</text></view>
			<view :class="[!type?'right':'righter']" @tap="getOrder">我要报名</view>
		</view>



	</view>
</template>

<script>
	import {
		mapState,
		mapActions
	} from 'vuex'
	export default {
		computed: {
			...mapState(['token'])
		},
		data() {
			return {
				id: '',
				url: '',
				status: '',
				info: {},
				type: null,
				join: null,
				scanObj: {}
			};
		},
		//分享给个人
		onShareAppMessage() {
			return {
				title: '青年交友',
				imageUrl: 'https://friend.tanshishang.cn/assets/img/shareImg.png',
				path: '/pages/index/index'
			}
		},
		onLoad(options) {
			if (options.scene) {
				//扫码进入
				let scene = decodeURIComponent(options.scene);
				console.log("scene is ", scene);
				let arrPara = scene.split("&");
				let arr = [];
				for (var i in arrPara) {
					arr = arrPara[i].split("=");
					if (arr[0] == 'id') {
						this.scanObj.id = arr[1];
					}else if(arr[0]== 'status'){
						this.scanObj.status = arr[1];
					}
				}
				console.log(this.scanObj);
				this.id = this.scanObj.id;
				this.status = this.scanObj.status;
				
			} else if (options.id) {
				//正常进入
				this.id = options.id;
				this.status = options.status;
				console.log(this.status);
			}


		},
		onShow() {
			console.log('token:'+this.token);
			this.getData();
		},
		methods: {
			//执行我要报名
			getOrder() {
				if (this.status == 1) {
					uni.showLoading({
						title: '正在报名...'
					});
					setTimeout(() => {
						uni.hideLoading();
						if (this.join) {
							uni.showToast({
								title: '你已经报过名了!',
								mask: true,
								icon: 'none'
							})
						} else {
							this.doResutl();
						}
					}, 1000)
				} else {
					uni.showToast({
						title: '该活动已结束!',
						mask: true,
						icon: 'none'
					})
				}
			},
			async doResutl() {
				try {
					let params = {
						token: this.token,
						id: this.info.id
					};
					let res = await this.$request.request.post('/api/active/enlist', params)
					console.log(res);
					if (res.code == 200) {
						if (this.info.cost !== 0) {
							//防止活动价格误设
							this.doPay(res.data.orderNo);
						} else {
							this.$tips.success("报名成功");
						}
					}

				} catch (err) {
					//未开通VIP
					if (err.code == 4) {
						uni.showModal({
							title: '温馨提醒',
							content: '您还未开通VIP，仅有VIP才能进行此项操作',
							showCancel: true,
							confirmText: '开通VIP',
							success: (res) => {
								// console.log(res);
								if (res.confirm) {
									this.toPay();
								} else if (res.cancel) {
									console.log('用户点击取消');
								}

							}
						});
					} else {
						this.$request.error(err, this);
					}
				}
			},
			//调用微信支付
			async doPay(e) {
				try {
					let params = {
						token: this.token,
						id: this.info.id,
						orderNo: e
					};
					let res = await this.$request.request.post('/api/active/ngagement', params)
					console.log(res);
					uni.hideLoading();
					//再发起微信支付
					uni.requestPayment({
						provider: 'wxpay',
						timeStamp: res.data.timeStamp,
						nonceStr: res.data.nonceStr,
						package: res.data.package,
						signType: res.data.signType,
						paySign: res.data.paySign,
						success: res => {
							this.$tips.success("支付成功");
							setTimeout(() => {
								uni.navigateBack({
									delta: 1
								})
							}, 2000);
						},
						fail: (err) => {
							console.log(err);
							this.$tips.fail("支付失败");
						}
					});
				} catch (err) {
					this.$request.error(err, this)
				}
			},
			//获取数据
			async getData() {
				try {
					let params = {
						token: this.token,
						id: this.id
					};
					let res = await this.$request.request.get('/api/active/detail', params)
					console.log(res);
					if (res.code == 200) {
						this.info = res.data.data;
						this.join = res.data.join;
						this.info.cost ? this.info.cost = this.info.cost.toFixed(2) : '';
						this.info.image = this.$config.API + this.info.image;
						//判断底部按钮
						if (res.data.join) {
							this.type = true;
						} else {
							if (this.status == 0) {
								this.type = true;
							} else {
								this.type = false;
							}

						}
					}
				} catch (err) {
					this.$request.error(err, this);
				}
			},
			//转换时间戳
			doreset(e) {
				//转换时间戳
				if ((e + '').length != 13) {
					var date = new Date(e * 1000); //如果date为13位不需要乘1000
					var Y = date.getFullYear() + '-';
					var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
					var D = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate()) + ' ';
				} else {
					var date = new Date(e); //如果date为13位不需要乘1000
					var Y = date.getFullYear() + '-';
					var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
					var D = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate()) + ' ';
				}
				return Y + M + D;
			},
			//VIP支付
			async toPay() {

				try {
					let params = {
						token: this.token
					};
					let res = await this.$request.request.post('/api/user/renewal', params)
					console.log(res);
					if (res.code == 200) {
						//跳转支付页
						uni.navigateTo({
							url: '/pages/my/payInfo?orderNo=' + res.data.orderNo + '&price=' + res.data.price
						})
					}
				} catch (err) {
					this.$request.error(err, this);
				}
			}
		}
	}
</script>

<style lang="scss">
	@import 'activitiesDetail.scss'
</style>
